fix(scan): error states for token detail, richlist, and active accounts#102
Conversation
fetchRichlist, fetchTokenHolders, fetchTokenTrades, and fetchActiveAccounts returned [] on a failed request; they now return null so the hook flags an error. Wired the FetchError state into the token detail holders and trades tabs, the top-holders and whale leaderboards, and the most-active accounts list.
dfefcaa to
b1f0b75
Compare
📝 WalkthroughWalkthroughList fetch helpers now return null when the underlying API request fails. The leaderboard account active, leaderboard account holders, leaderboard whale top, and token detail pages now read error and retry values from their data hooks and render Sequence Diagram(s)sequenceDiagram
participant TopHoldersPage
participant useRichlist
participant fetchRichlist
participant apiFetch
participant FetchError
TopHoldersPage->>useRichlist: request richlist data
useRichlist->>fetchRichlist: fetchRichlist(network, limit)
fetchRichlist->>apiFetch: request list endpoint
apiFetch-->>fetchRichlist: null on failure
fetchRichlist-->>useRichlist: null
useRichlist-->>TopHoldersPage: error and retry
TopHoldersPage->>FetchError: render on error
FetchError-->>TopHoldersPage: onRetry
TopHoldersPage->>useRichlist: retry
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
apps/scan/app/[locale]/tokens/[addr]/page.tsx (1)
153-159: 🩺 Stability & Availability | 🟡 MinorAdd data-preserving guards to error branches in both tabs.
Loading (
tradesLoading && !trades,holdersLoading && !holders) correctly preserves populated rows during background polls, but the error branches (tradesError,holdersError) are currently unconditional. A transient API failure will replace valid data with the retry error screen.Gating the error display on
... && !dataensures consistent behavior where stale data persists until a successful refresh or initial load failure.Apply these changes
@@ -(line dependent),-(line dependent) +-(line dependent),-(line dependent) @@ {tradesLoading && !trades ? ( <div className="p-4 space-y-2"> {Array.from({ length: 6 }).map((_, i) => <Skeleton key={i} className="h-12 w-full" />)} </div> - ) : tradesError ? ( + ) : tradesError && !trades ? ( <FetchError onRetry={retryTrades} /> - @@ -(line dependent),-(line dependent) +-(line dependent),-(line dependent) @@ {holdersLoading && !holders ? ( <div className="p-4 space-y-2"> {Array.from({ length: 6 }).map((_, i) => <Skeleton key={i} className="h-12 w-full" />)} </div> - ) : holdersError ? ( + ) : holdersError && !holders ? ( <FetchError onRetry={retryHolders} />🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/scan/app/`[locale]/tokens/[addr]/page.tsx around lines 153 - 159, The error branches in the token page tabs are unconditional, so a transient failure can hide already-loaded rows; update the conditional rendering in the trades and holders sections of page.tsx so FetchError only shows when the corresponding data array is empty or missing. Use the existing symbols tradesError/trades and holdersError/holders alongside the loading guards in the same ternary chains to preserve stale data during background refreshes while still showing the retry state on initial load failure.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Outside diff comments:
In `@apps/scan/app/`[locale]/tokens/[addr]/page.tsx:
- Around line 153-159: The error branches in the token page tabs are
unconditional, so a transient failure can hide already-loaded rows; update the
conditional rendering in the trades and holders sections of page.tsx so
FetchError only shows when the corresponding data array is empty or missing. Use
the existing symbols tradesError/trades and holdersError/holders alongside the
loading guards in the same ternary chains to preserve stale data during
background refreshes while still showing the retry state on initial load
failure.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 1b945447-a336-4806-83f8-c945548b89de
📒 Files selected for processing (5)
apps/scan/app/[locale]/leaderboard/account/active/page.tsxapps/scan/app/[locale]/leaderboard/account/holders/page.tsxapps/scan/app/[locale]/leaderboard/whale/top/page.tsxapps/scan/app/[locale]/tokens/[addr]/page.tsxapps/scan/lib/api.ts
Continues surfacing fetch errors across the explorer (follows #100, #101).
What changed
Four more fetchers now return null on a failed request instead of an empty array, so the hook flags an error instead of the page looking empty: fetchRichlist, fetchTokenHolders, fetchTokenTrades, fetchActiveAccounts. Each is called only by its usePolling hook, which already handles null.
Wired the existing FetchError state into the token detail holders and trades tabs, the top-holders and whale leaderboards, and the most-active accounts list.
Testing
typecheck and build pass. Verified live: with the richlist endpoint failing, the top-holders and whale pages render the retry state instead of an empty list. The active-accounts endpoint is currently responding, so that page shows its normal state.
Not in this PR
/contracts (fetchRecentContracts) uses a direct call with its own error state and needs separate handling. The leaderboard niche fetchers, event logs, and the home Latest Blocks list still swallow errors and can adopt the same pattern.